<template>


	<view class="container">
		<view class="content" style="padding-top: 0;">
      <view class="bg-box">

      </view>
			<view class="imgbox">

			</view>
			<!-- <view class="head">
				<br />
				<text>欢迎来到荷马商城</text>
			</view> -->
			<view class="box">
				<view class="titlebox">
					<view class="left active">
						<!-- 验证码登录 -->
					</view>
				</view>
			<view class="list">
				<view class="item">
					<view class="items">
							<view class="image">
								手机号
							</view>
						<input class="uni-input" maxlength="11" v-model="form.mobile" placeholder="请输入电话" />
					</view>
				</view>
				<view class="item">
					<view class="items">
							<view class="image">
								验证码
							</view>
						<input class="uni-input" maxlength="6" v-model="form.password" placeholder="请输入验证码"/>
					</view>
					<view class="code-box" @click="getcode">
						{{time}}
					</view>
				</view>
				<view class="titleboxs">
					<view class="left" @click="$goURl('/pages/login/login')">
						<view ></view>
						切换为密码登录
					</view>

				</view>


				<view class="" >
					<label class="radio" @click="checkedchange"
						style="display: flex;align-items: center;margin-top: 280rpx;">
						<uni-icons type="checkbox" color="#F63B29" v-if="checked" size="20"></uni-icons>
						<uni-icons type="circle" v-else size="20"></uni-icons>
						我已阅读并同意<text style="color: #F67800;"
							@click="$goURl('/pages/personal/agreement/agreement?code=1')">《用户协议》</text><text
							style="color: #666;" >与</text><text
							@click="$goURl('/pages/personal/agreement/agreement?code=0')" style="color: #F67800;">《隐私政策》</text>
					</label>
				</view>
				<view class="btnBoxs" @click="login" style="margin: 20rpx 0 0 0;">
					登录
				</view>
				<view class="btnBox-text" @click="$goURl('/pages/login/register')">
					没有账号,<text>立即注册</text>
				</view>
			</view>


		</view>
		</view>
	</view>
</template>

<script setup>
	import {ref,reactive,getCurrentInstance} from "vue";
	import {onLoad,onShow} from "@dcloudio/uni-app";

	const {appContext} = getCurrentInstance();
	let form = reactive({
		mobile: '',
		password:'',
		code:1
	})
	const checked = ref(false)
  function checkedchange() {
    console.log(12)
    checked.value = !checked.value
  }

  let time=ref('获取验证码')
	let showPassword = ref(true)
	function getcode(){
		if(time.value!='获取验证码'){
			return false
		}
		if (!(/^1[3456789]\d{9}$/).test(form.mobile)) {
			uni.showToast({
				icon: 'none',
				position: 'bottom',
				title: '手机号不正确'
			});
			return false;
		}
		appContext.config.globalProperties.$request({
			url: `api/smscodesview/`,
			method:'post',
			data:{mobile:form.mobile} ,
			success(res) {

				if(res.errno==0){
					let times=60
					let timer=setInterval(function(){
						if(times==0){
							time.value='获取验证码'
							clearInterval(timer)
						}else{
							times--
							time.value=times+'S重发'
						}
					},1000)
				}else{
					uni.showToast({
						icon:'none',
						title:res.errmsg
					})
				}
			}
		})
	}
	function login() {

		if (!checked.value) {
			uni.showToast({
				icon: 'none',
				position: 'bottom',
				title: '请同意用户协议与隐私协议'
			});
			return false;
		}

		if (!(/^1[3456789]\d{9}$/).test(form.mobile)) {
			uni.showToast({
				icon: 'none',
				position: 'bottom',
				title: '手机号不正确'
			});
			return false;
		}

		appContext.config.globalProperties.$request({
			url: `api/login/`,
			method: 'post',
			data: form,
			success(res) {
				console.log(res)
				uni.showToast({
					icon: 'none',
					title: res.errmsg
				})
				if (res.errno == 0) {
					let user=res.data
					 user['password']=form.password
					uni.setStorageSync('userInfo',user)
					let list=uni.getStorageSync('userList')?uni.getStorageSync('userList'):[]
					list = list.filter(item=>{
						return item.ID!=res.data.ID
					})
					list.unshift(user)
					uni.setStorageSync('userList',list)
					getExplain() //获取首页数据
					setTimeout(()=>{
						uni.switchTab({
							url: '/pages/personal/index'
						})
					},1000)
				}
			}
		})
	}
	function getExplain(){
			appContext.config.globalProperties.$request({
				url: `api/decoration/`,
				method: 'get',
				success(res) {
					if (res.errno == 0) {
					uni.setStorageSync('explain', res.data.explain)
				  const explain = JSON.parse(res.data.explain)
					} else {
						uni.showToast({
							icon: 'none',
							title: res.errmsg
						})
					}
				}
			})
	}
	function changePassword() {
		console.log('showPassword', showPassword.value)
		showPassword.value = !showPassword.value;
	}

	function back() {
		console.log(123)
		uni.navigateBack()
	}

</script>
<style lang="scss" scoped>
	@import '@/static/css/login.scss';
	page{
		background: linear-gradient( 180deg, #FFFFFF 0%, #F4EBDB 100%);
		height: 100vh;
	}
	.code-box{
		font-weight: 400;
		font-size: 28rpx;
		color: #F67800;
		width: 250rpx;
	}
	.bg-box{
		height: 528rpx;
		width: 100%;
		background-image: url('https://pili-vod.guanxikeji.com/fubao/img/1755841817057.png');
		background-size: 100%;
	}
</style>
